<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>

	<body>
		<!-- 标题headline -->
		<h1>一级标题</h1>
		<h2>二级标题</h2>
		<h3 id="h3">三级标题</h3>
		<h4>四级标题</h4>
		<h5>五级标题</h5>
		<h6>六级标题</h6>
		<!-- p=paragraph 段落-->
		<p>王老师是Java讲师，朱老师是Java讲师，高老师是Java讲师</p>
		<p>鞠老师是H5讲师，李老师是H5讲师</p>
		<!--img  图片
			alt:替代文字，图片没有加载出来显示的文字
			width:宽
			height:高
		-->
		<img src="../images/bd_logo11.png" alt="加载失败"></img>
		<img src="../images/bd_logo1.png" />
		<img src="../images/bd_logo1.png" />
		<img src="../images/bd_logo1.png" width="100px" height="100px" />

		<!-- br 换行 -->
		<br />

		<!-- a 超链接 
			target="_blank" 在新窗口打开
			title="悬停文字"
		-->
		<a href="http://www.baidu.com" title="悬停文字" target="_blank">超链接文字</a>
		<!-- 页面内的锚点使用id，使用a标签可以跳转到指定锚点 -->
		<a href="#h3">跳转到h3标题</a>
		<a href="#">跳转到网页的开始</a>

		<!-- hr  -->
		<hr />

		<!--有序列表 ol=ordered list -->
		<ol>
			<li>北京</li>
			<li>上海</li>
			<li>深圳</li>
			<li>广州</li>
		</ol>
		<!--无序列表 ul=unordered list -->
		<ul>
			<li>北京</li>
			<li>上海</li>
			<li>深圳</li>
			<li>广州</li>
		</ul>
		<!-- 无序列表和有序列表可以嵌套 -->
		<ul>
			<li>北京</li>
			<li>上海</li>
			<li>深圳</li>
			<li>广州</li>
			<li>
				山东
				<ol>
					<li>青岛</li>
					<li>济南</li>
					<li>烟台</li>
				</ol>
			</li>
		</ul>

		<div>
			<span><u>山东省</u><i>青岛市</i><span style="color: red;"><b>城阳区</b>春阳路大润发</span></span>
		</div>

		<!--空格折叠现象 
			普通的空格在html里如果连续出现多个会被当成一个空格，
			如果想显示多个连续的空格就要使用特殊的字符
			&nbsp;    Non-breaking Space
		-->
		<div>
			锄禾日当&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;午<br/> 
			汗滴禾下&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;土<br/>
			谁知盘中&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;餐<br/>
			粒粒皆辛&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;苦<br/>
		</div>

		<hr />
		<!--border:边框 cellspacing:单元格间隙 -->
		<table border="1" cellspacing="0" width="400">
			<tr>
				<th>讲师名称</th>
				<th>所教班级</th>
			</tr>
			<tr>
				<td>王老师</td>
				<td>Java180701</td>
			</tr>
			<tr>
				<td>朱老师</td>
				<td>Java180702</td>
			</tr>
			<tr>
				<td>高老师</td>
				<td>Java180703</td>
			</tr>
		</table>

		<table border="1" cellspacing="0" width="400">
			<thead>
				<tr>
					<th>讲师名称</th>
					<th>所教班级</th>
				</tr>
			</thead>
			<tbody>
				<tr>
					<td>王老师</td>
					<td>Java180701</td>
				</tr>
				<tr>
					<td>朱老师</td>
					<td>Java180702</td>
				</tr>
				<tr>
					<td>高老师</td>
					<td>Java180703</td>
				</tr>
			</tbody>
		</table>
		<!-- rowspan 行跨越 -->
		<table border="1" cellspacing="0" width="400">
			<tr>
				<th>讲师名称</th>
				<th>所教班级</th>
			</tr>
			<tr>
				<td rowspan="2">王老师</td>
				<td>Java180701</td>
			</tr>
			<tr>
				<!--<td>朱老师</td>-->
				<td>Java180702</td>
			</tr>
			<tr>
				<td>高老师</td>
				<td>Java180703</td>
			</tr>
		</table>
		<!-- colspan 列跨越 -->
		<table border="1" cellspacing="0" width="400">
			<tr>
				<th>讲师名称</th>
				<th>所教班级</th>
			</tr>
			<tr>
				<td colspan="2">王老师</td>
				<!--<td>Java180701</td>-->
			</tr>
			<tr>
				<td>朱老师</td>
				<td>Java180702</td>
			</tr>
			<tr>
				<td>高老师</td>
				<td>Java180703</td>
			</tr>
		</table>
	</body>

</html>